@import '../../assets/public.less';
@import '../../assets/reset.less';
.exchange {
    min-width: 1280px;
    padding: 0 0px;
    padding-top: 5px;
    .klinAndTring {
        .clearfix();
        display: flex;
        height: 850px;
        #pane-first,
        #pane-second {
            overflow: initial !important;
        }
        overflow-y: hidden;
        .exchange_nav {
            //          float: right;
            //          width: 32%;
            width: 605px;
            min-width: 500px;
            box-sizing: border-box;
            padding-left: 5px;
            overflow: hidden;
            .topWarp {
                width: 100%;
                padding-bottom: 5px;
                .clearfix();
                .nav_list {
                    width: 50%;
                    min-width: 245px;
                    float: left;
                    box-sizing: border-box;
                    padding-right: 5px;
                    .currency_header {
                        line-height: 49px;
                        p {
                            margin-left: 30px;
                            text-align: center;
                            width: 85px;
                        }
                    }
                    .currency_surface_header {
                        .currency_surface_list {
                            display: inline-block;
                            width: 32%;
                            text-align: center;
                            line-height: 35px;
                            font-size: 14px;
                        }
                    }
                    .MainArea_box {
                        padding-bottom: 10px;
                        .MainArea_main,
                        .Innovate_main {
                            .MainArea_list,
                            .Innovate_list {
                                cursor: pointer;
                                font-size: 13px;
                                p {
                                    display: inline-block;
                                    width: 32%;
                                    text-align: center;
                                    line-height: 35px;
                                    font-size: 12px;
                                }
                            }
                            .MainArea_list {
                                border-bottom: none;
                            }
                        }
                        .MainArea_main {
                            height: 315px;
                        }
                        .down {
                            color: @DaiOtherColor2 !important;
                        }
                        .up {
                            color: @DaiOtherColor1 !important;
                        }
                    }
                    .Innovate_box {}
                    .announcementWarp {
                        .tradingNotice {
                            h2 {
                                height: 50px;
                                line-height: 50px;
                                border-top: 15px solid #f2f3f8;
                                border-bottom: 5px solid #f2f3f8;
                                font-weight: 700;
                                padding: 0 15px;
                            }
                            .announcementList {
                                height: 470px;
                                padding-bottom: 50px;
                                .list {
                                    height: 42px;
                                    padding: 6px 15px;
                                    border-bottom: 1px solid #ebeef5;
                                    cursor: pointer;
                                    .title {
                                        height: 26px;
                                        line-height: 26px;
                                        color: #606266;
                                        font-size: 14px;
                                        overflow: hidden;
                                        text-overflow: ellipsis;
                                        display: -webkit-box;
                                        -webkit-line-clamp: 1;
                                    }
                                    .time {
                                        color: #909399;
                                        font-size: 12px;
                                        float: right;
                                    }
                                }
                            }
                        }
                    }
                }
                .transaction_main {
                    width: 50%;
                    min-width: 245px;
                    float: right;
                    overflow: hidden;
                    .transaction_header {
                        line-height: 40px;
                        padding-left: 15px;
                        font-size: 16px;
                    }
                    .transaction_nav,
                    .PurchaseData_list,
                    .SelloutData_list {
                        overflow: hidden;
                        zoom: 1;
                    }
                    .PurchaseData_list {
                        line-height: 28px;
                    }
                    .transaction_nav {
                        line-height: 35px;
                        p {
                            width: 33%;
                            display: inline-block;
                            text-align: center;
                            float: left;
                            color: #909399;
                            font-size: 16px;
                        }
                    }
                    .PurchaseData {
                        padding-bottom: 10px;
                    }
                    .SelloutData {
                        padding-top: 10px;
                    }
                    .PurchaseData,
                    .SelloutData {
                        border-top: 1px solid @DaiDorderColor9;
                        color: @YeFontSizeColor11;
                        font-size: 12px;
                        line-height: 24px;
                        .PurchaseData_list,
                        .SelloutData_list {
                            p {
                                width: 33%;
                                display: inline-block;
                                text-align: center;
                                float: left;
                            }
                        }
                    }
                    .transaction_mainHeader {
                        height: 50px;
                        line-height: 50px;
                        border-bottom: 3px solid @DaiDackGroundColor15;
                        padding-left: 20px;
                        .newPrice {
                            font-size: 14px;
                            color: @DaiFontSizeColor27;
                        }
                        .changeCny {
                            font-size: 14px;
                            color: @DaiFontSizeColor28;
                        }
                    }
                    .transaction_mainConnent {
                        height: 361px;
                        .PurchaseData_name {
                            font-size: 12px;
                        }
                    }
                    .loading {
                        padding-top: 100px;
                        box-sizing: border-box;
                        text-align: center;
                    }
                }
            }
            .transaction {
                padding-bottom: 10px;
                display: flex;
                .transaction_box {
                    .el-tabs__header {
                        padding: 10px 0;
                    }
                    position: relative;
                    .canuser {
                        position: absolute;
                        right: 0;
                        top: 14px;
                        color: #606266;
                        font-size: 14px;
                        //                  font-weight: 700;
                    }
                    button.el-button {
                        height: 38px;
                        line-height: 20px;
                        border-radius: 7px;
                    }
                    .jiaoyiAll {
                        margin-bottom: 30px;
                        p {
                            color: @DaiOtherColor1;
                        }
                    }
                    .jiaoyiSell {
                        p {
                            color: @DaiOtherColor2;
                        }
                    }
                    .el-tabs__content {
                        overflow: auto;
                    }
                    flex: 1;
                    margin: 0 20px;
                    //              overflow: hidden;
                    height: 100%;
                    .el-tab-pane {
                        overflow: hidden;
                        zoom: 1;
                        input {
                            height: 40px;
                        }
                    }
                    .el-button {
                        width: 100%;
                    }
                    .number {
                        margin: 0 auto;
                    }
                    .Purchase,
                    .Sellout {
                        display: inline-block;
                        float: right;
                        width: 42%;
                        margin-right: 30px;
                        .stopWarp {
                            width: 90%;
                            position: relative;
                            left: 66px;
                        }
                        .stoploss,
                        .stopwin {
                            width: 50%;
                            float: left;
                            display: inline-block;
                            h2 {
                                font-size: 14px;
                                // color: #606266;
                                padding-left: 14px;
                                font-size: 12px;
                                // color: @cunColor;
                            }
                            .stoploss_box,
                            .stopwin_box {
                                width: 80%;
                                margin: 0 auto;
                            }
                        }
                        .MaxLen {
                            float: right;
                            // color: @cunColor;
                            position: relative;
                            top: 5px;
                            font-size: 12px;
                        }
                        button.el-button {
                            background: @DaiOtherColor2;
                            color: #fff;
                            border: none;
                        }
                    }
                    .buyWarp {
                        button.el-button {
                            background: @DaiOtherColor1;
                            color: #fff;
                            border: none;
                        }
                    }
                    .el-form-item__label {
                        text-align: left;
                    }
                }
            }
        }
        .exchange_mian {
            flex: 1;
            overflow: hidden;
            height: 100%;
            position: relative;
            .exchange_box {
                .Placeanorder_header_box {
                    height: 50px;
                    line-height: 50px;
                    border-bottom: 1px solid @DaiDackGroundColor15;
                    overflow: hidden;
                    zoom: 1;
                    padding-left: 20px;
                    overflow: hidden;
                    zoom: 1;
                    .Placeanorder_list_header {
                        font-size: 18px;
                        padding-right: 10px;
                    }
                    .Placeanorder_list_conent {
                        width: 70%;
                        .newPrice {
                            margin-right: 5px;
                            .price {
                                font-size: 18px;
                            }
                            .cny {
                                font-size: 12px;
                            }
                        }
                        font-size: 14px;
                        color: #909399;
                        p {
                           
                            margin-right: 3%;
                        }
                    }
                    li,
                    p {
                        float: left;
                    }
                }
            }
            .kine {
                width: 100%;
                height: 600px;
            }
            .CurrentEntrustment {
                .CurrentEntrustment_header {
                    border-bottom: 10px solid #f2f3f8;
                    height: 40px;
                    line-height: 40px;
                    z-index: 100;
                    background-color: #FFFFFF;
                    padding-left: 10px;
                    border-radius: 5px;
                }
            }
            .HistoricalEntrustment {
                position: relative;
                .tojingtotle {
                    position: absolute;
                    right: 180px;
                    top: 52px;
                    color: #606266;
                    z-index: 99999;
                    font-size: 14px;
                    //              font-weight: 700;
                    span {
                        padding-right: 20px;
                    }
                }
            }
            .big {
                position: absolute;
                transition: all .3s;
                opacity: 0.5; 
                top: 15px;
                right: 20px;
                width: 22px;
                height: 22px;
                cursor: pointer;
                img {
                    width: 100%;
                }
            }
            .big:hover {
                opacity: 1;
                transform: scale(1.2);
                -ms-transform: scale(1.2);
                /* IE 9 */
                -moz-transform: scale(1.2);
                /* Firefox */
                -webkit-transform: scale(1.2);
                /* Safari 和 Chrome */
                -o-transform: scale(1.2);
            }
        }
    }
    .el-tabs__item.is-active {
        color: @DaiFontSizeColor26;
    }
    .el-tabs__item:hover {
        color: @DaiFontSizeColor26;
    }
    .el-tabs__active-bar {
        background-color: @DaiFontSizeColor26;
    }
}